<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <div th:replace="fragments/resourceLink :: resourceLink"></div>
    <script type="text/javascript" src="../../../resources/js/articleList.js"></script>
    <title>showArticle</title>
</head>
<body>
<div class="container">
    <div class="row clearfix">
        <div class="col-md-12 column">
            <div class="row clearfix">
                <div class="col-md-8 column col-md-offset-2">
                    <div class="row clearfix">
                        <div class="col-md-12 column">
                            <div class="page-header">
                                <h1>
                                    校園心裏輔導系統
                                    <small>Article</small>
                                </h1>

                            </div>
                            <hr>
                        </div>
                        <div class="col-md-12 column">
                            <div class="navbar navbar-inverse" th:replace="fragments/headmanager :: headmanager">
                            </div>
                        </div>
                    </div>
                    </br>
                    <div class="row clearfix">
                        <div class="col-md-12 column">
                            <h2 th:text="${article.article_name}" style="text-align: center;"></h2>
                            <div class="col-md-12 column">
                                <span class="label label-success" >作者</span>
                                <strong th:text="${article.article_author}" class="column "></strong>
                                <p th:text="${article.article_createTime}" class="pull-right column"></p>
                            </div>
                        </div>
                        <br>
                        <br>
                        <div class="col-md-12 column">
                            <p th:text="${article.article_context}">
                                Donec id elit non mi porta gravida at eget metus. Fusce dapibus,
                                tellus ac cursus commodo, tortor mauris condimentum nibh,
                            </p>
                        </div>
                        <br>
                        <br>
                        <div class="col-md-12 column" style="margin-bottom: 20px;">
                            <a class="button button-info pull-right"
                               th:id="${article.article_id}"
                               onclick="viewComment(this);">查看评论</a>
                        </div>

                        <div id="commentList">

                        </div>

                    <!--    <div id="commentList" th:each="comment,commentStat:${commentList}">
                            <span th:text="${comment.userName}"></span>
                            <p th:text="${comment.context}"></p>
                            <span th:text="${comment.createTime}" class="pull-right"></span>
                            <hr>
                        </div>-->
                        <div class="col-md-12 column">
                            <div class="form-group">
                                <input  class="form-control col-md-6" id="comment_context" />
                                <button class="label label-success col-md-1"
                                        for="comment_context"
                                        th:article_id="${article.article_id}"
                                        th:user_id="${session.id}"
                                        th:user_name="${session.name}"
                                        onclick="comment(this);">评论</button>

                            </div>
                        </div>
                    </div>
                    </br>
                    <!--页脚-->
                    <div th:replace="fragments/footer :: footer" class="col-lg-12">
                        &copy; 2017 The Static Templates
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

</body>
</html>